
<template>
  <div class="page-container">
    <!--面包屑导航-->
    <div class="breadcrumb">
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item>会员中心</el-breadcrumb-item>
        <el-breadcrumb-item>会员等级管理</el-breadcrumb-item>
        <el-breadcrumb-item>等级适用范围</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <el-form status-icon :model="dataForm" :rules="dataFormRules">
      <el-form-item label="等级适用范围：" prop="scopeApplication" class="mb20">
        <el-select
          v-model="dataForm.scopeApplication"
          placeholder="请选择"
          :disabled="scopeDis"
          class="w326 iconAlignment"
        >
          <el-option label="请选择" value="0"></el-option>
          <el-option label="商家" value="1"></el-option>
          <el-option label="店铺" value="2"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item class>
        <span class="ruleDes font10 color999">说明：</span>
        <span
          class="ruleDes font10 color999 turnInlineBlock mb6"
        >•商家：指在旗下店铺统一用一套等级系统；新增的店铺将自动纳入统一管理范围：</span>
        <br />
        <span class="ruleDes font10 color999 turnInlineBlock mb6 p_l40">•店铺：指每个店铺可创建自己的等级系统；</span>
        <br />
        <span class="ruleDes font10 color999 turnInlineBlock mb6 p_l40">•本规则同时适用等级设置及VIP设置；</span>
        <br />
        <span class="ruleDes font10 color999 turnInlineBlock mb6 p_l40">•等级适用范围确认后不可修改</span>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" v-show="clearDis" plain class="mr60">取 消</el-button>
        <el-button type="primary" @click="onSubmit(dataForm)" v-show="clearDis">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import KtButton from "@/views/Core/KtButton";
export default {
  components: {
    KtButton
  },
  data() {
    return {
      deptType: null, //会员所属层级
      clearDis: true, //保存按钮是否显示
      dataForm: {
        scopeApplication: "1",
        whetherApplication: null
      },
      dataFormRules: {
        scopeApplication: [
          { required: true, message: "请选择适用范围", trigger: "blur" }
        ]
      },
      scopeDis: false
    };
  },
  methods: {
    onSubmit() {
      let this_ = this;
      this_.dataForm.whetherApplication = 1;
      this.$confirm("您确定要保存该设置吗?等级适用范围确认后不可修改", "提示", {
        type: "warning",
        closeOnClickModal: false
      })
        .then(() => {
          this_.utils.request.saveScopeApplication(this_.dataForm, function(
            res
          ) {
            if (res.data == 1) {
              this_.$message({
                message: "保存成功 ",
                type: "success"
              });
              this_.clearDis = false;
            }
          });
        })
        .catch(() => {});
    },
    //查询当前登录账号所属层级
    getDeptType() {
      let this_ = this;
      this.utils.request.getDeptType({}, function(res) {
        this_.deptType = res.deptType;
      });
    },
    getGrowhtScopeInfo() {
      let this_ = this;
      this.utils.request.getGrowhtScopeInfo({}, function(res) {
        if (this_.deptType != 2) {
          this_.clearDis = false;
          this_.scopeDis = true
        } else {
          if (res.whetherApplication != "1") {
            this_.clearDis = true;
          } else {
            this_.clearDis = false;
            this_.scopeDis = true;
          }
        }
        this_.dataForm.scopeApplication = res.scopeApplication;
      });
    }
  },
  mounted() {
    this.getGrowhtScopeInfo();
    this.getDeptType();
  }
};
</script>
<style scoped lang="scss">
.font10 {
  font-size: 10px !important;
}
.iconAlignment {
  /deep/ .el-input__icon {
    line-height: 32px !important;
  }
}
.turnInlineBlock {
  display: inline-block !important;
}
.mb6 {
  margin-bottom: 6px !important;
}
.p_l40 {
  padding-left: 40px !important ;
}
</style>



